<!--
 * 病患信息
 *
-->
<template>
  <div style="width: 100%;margin-top: -10px;">
    <el-card  shadow="hover" :model="ruleForm" :rules="rules" ref="ruleForm">
        <table style="margin-right: auto;margin-left: auto">
            <tr>
                <td>账号</td>
                <td>姓名</td>
            </tr>
            <tr>
                <td><el-input  v-model="patientData.pId"></el-input></td>
                <td><el-input  v-model="patientData.pName"></el-input></td>
            </tr>
            <tr>
                <td>性别</td>
                <td>手机号</td>
            </tr>
            <tr>
                <td><el-input  v-model="patientData.pSex"></el-input></td>
                 <td><el-input  v-model="patientData.pPhone"></el-input></td>
            </tr>
            <tr>
                <td>身份证号</td>
                 <td>Email</td>
            </tr>
            <tr>
                <td><el-input  v-model="patientData.pCard"></el-input></td>
                 <td><el-input  v-model="patientData.pEmail"></el-input></td>
            </tr>
            <tr>
                <td>出生日期</td>
                 <td>民族</td>
            </tr>
            <tr>
                <td><el-input  v-model="patientData.pBirthday"></el-input></td>
                  <td><el-input  v-model="patientData.pNation"></el-input></td>
            </tr>
          <tr>
            <td>紧急联系人</td>
            <td>家庭住址</td>
          </tr>
          <tr>
            <td><el-input  v-model="patientData.pEmerg"></el-input></td>
            <td><el-input  v-model="patientData.pAddress"></el-input></td>
          </tr>
          <tr style="margin-left: auto">
            <td></td>
            <td></td>
            <td>
<!--              <el-button-->
<!--                  style="font-size: 14px"-->
<!--                  type="success"-->
<!--                  @click="modifyPatient('ruleForm')">保存</el-button>-->
            </td>
          </tr>
        </table>
    </el-card>
</div>
</template>
<script>
import jwtDecode from "jwt-decode";
import { getToken} from "@/utils/storage.js";
import request from "@/utils/request.js";
import log from "echarts/src/scale/Log";
export default {
    name: "PatientCard",
    data() {
      //校验手机方法
      var validateMoblie = (rule, value, callback) => {
        if (value === undefined) {
          callback(new Error("请输入手机号"));
        } else {
          let reg =
              /^1(3[0-9]|4[5,7]|5[0,1,2,3,5,6,7,8,9]|6[2,5,6,7]|7[0,1,7,8]|8[0-9]|9[1,8,9])\d{8}$/;
          if (!reg.test(value)) {
            callback(new Error("请输入合法的手机号"));
          }
          callback();
        }
      };
      //校验身份证方法
      var validateCard = (rule, value, callback) => {
        if (value === undefined) {
          callback(new Error("请输入身份证号"));
        } else {
          let reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
          if (!reg.test(value)) {
            callback(new Error("请输入合法的身份证号码"));
          }
          callback();
        }
      };
        return {
            userId:"",
            patientData:{},
          ruleForm: {},
          rules: {
            pId: [
              { required: true, message: "请输入账号", trigger: "blur" },
              {
                type: "number",
                message: "账号必须数字类型",
                trigger: "blur",
              },
            ],
            pName: [
              { required: true, message: "请输入姓名", trigger: "blur" },
              {
                min: 2,
                max: 5,
                message: "账号必须是2到5个字符",
                trigger: "blur",
              },
            ],
            pEmail: [
              { required: true, message: "请输入邮箱", trigger: "blur" },
              {
                type: "email",
                message: "请输入正确的邮箱地址",
                trigger: ["blur", "change"],
              },
            ],
            pPhone: [{ validator: validateMoblie }],
            pCard: [{ validator: validateCard }],
          },
        };

    },
    methods: {
      //点击修改患者信息
      modifyPatient(formName) {
        this.$refs[formName][0].validate((valid) => {
          if (valid) {
            request
                .get("admin/modifyPatient", {
                  params: {
                    pId: this.modifyForm.pId,
                    pName: this.modifyForm.pName,
                    pSex: this.modifyForm.pSex,
                    pPhone: this.modifyForm.pPhone,
                    pEmail: this.modifyForm.pEmail,
                    pCard: this.modifyForm.pCard,
                    pBirthday:this.modifyForm.pBirthday,
                    pNation:this.modifyForm.pNation,
                    pEmerg:this.modifyForm.pEmerg,
                    pAddress:this.modifyForm.pAddress,
                  },
                })
                .then((res) => {
                  if (res.data.status !== 200)
                    return this.$message.error("修改信息失败！");
                  this.modifyFormVisible = false;
                  this.search();
                  this.$message.success("修改医生信息成功！");
                });
          } else {
            return false;
          }
        });
      },
           //请求患者信息
        requestPatient(){
            request.get("patient/findPatientById", {
                params: {
                    pId: this.userId
                }
            })
            .then(res => {
                if(res.data.status != 200)
                return this.$message.error("获取数据失败");
                this.patientData = res.data.data;
            })
        },
    //token解码
    tokenDecode(token){
      if (token !== null)
      return jwtDecode(token);
    }
    },
    created(){
        //解码token信息
        this.userId = this.tokenDecode(getToken()).pId;
        this.requestPatient();
    }
}
</script>
<style lang="scss" scope>
td, th {
  white-space: nowrap;
  padding: 10px;
}
</style>
